<script setup>
defineProps({
  gameDetail: Object
})
const emit = defineEmits(["edit"])
const editHandle = () => {
  emit("edit", "gameDetail")
}
</script>

<template>
  <el-descriptions
      direction="vertical"
      border :column="3"
      title="详细信息">
    <template #extra>
      <el-button @click="editHandle" type="success">修改</el-button>
    </template>
    <el-descriptions-item label="购买次数">{{ gameDetail.buyTimes }}</el-descriptions-item>
    <el-descriptions-item label="横向图片">
      <el-image
          style="height: 100px"
          :src="gameDetail.widerPicture"
          :preview-src-list="[gameDetail.widerPicture]"/>
    </el-descriptions-item>
    <el-descriptions-item label="纵向图片">
      <el-image
          style="height: 100px"
          :src="gameDetail.higherPicture"
          :preview-src-list="[gameDetail.higherPicture]"/>
    </el-descriptions-item>
    <el-descriptions-item label="精简图片">
      <el-image
          style="simplePicture: 50px"
          :src="gameDetail.simplePicture"
          :preview-src-list="[gameDetail.simplePicture]"/>
    </el-descriptions-item>
    <el-descriptions-item label="海报">
      <el-image
          style="height: 100px"
          :src="gameDetail.post"
          :preview-src-list="[gameDetail.post]"/>
    </el-descriptions-item>
    <el-descriptions-item label="介绍">{{ gameDetail.introduction }}</el-descriptions-item>
    <el-descriptions-item label="描述">
      <div class="container" v-html="gameDetail.description"/>
    </el-descriptions-item>
  </el-descriptions>
</template>

<style scoped>

</style>
